package com.noocodecommit.wicket.jquery.plugin.ui.draggable;

import org.apache.wicket.ajax.AjaxRequestTarget;
import org.apache.wicket.markup.html.basic.Label;
import org.apache.wicket.model.Model;

import com.noocodecommit.wicket.jquery.TemplatePage;
import com.noocodecommit.wicket.stuff.jquery.JQCore;
import com.noocodecommit.wicket.stuff.jquery.plugin.JQPlugin;
import com.noocodecommit.wicket.stuff.jquery.plugin.chili.JQChili;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.draggable.JQDraggable;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.draggable.JQDraggableOptions;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.draggable.JQDraggablePlugin;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.draggable.JQDraggableUtils;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.draggable.OnDragStartBehavior;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.draggable.OnDragStopBehavior;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.tabs.JQTabs;

public class DraggablePage extends TemplatePage
{
	private final JQTabs tabContainer;

	public DraggablePage()
	{
		super();
		JQCore.init(this);
		this.setupChili();

		tabContainer = new JQTabs("tab-container");
		tabContainer.setOutputMarkupId(true);
		add(tabContainer);

		/**
		 * Simple Draggable
		 */
		JQDraggable d0 = JQDraggableUtils.create("draggable0").build();
		d0.setOutputMarkupId(true);
		tabContainer.add(d0);

		/**
		 * Ajax Draggable
		 */
		final Label output = new Label("output");
		output.setOutputMarkupId(true);
		tabContainer.add(output);

		final JQDraggable d1 = JQDraggableUtils.create("draggable1").helper(JQDraggableOptions.HELPER_CLONE).build();
		tabContainer.add(d1);

		d1.add(new OnDragStartBehavior()
		{
			public void onStart(AjaxRequestTarget target)
			{
				String msg = String.format("start drag '%s'", this.getComponent().getMarkupId());
				output.setModel(new Model(msg));
				target.addComponent(output);
			}
		});
		d1.add(new OnDragStopBehavior()
		{
			public void onStop(AjaxRequestTarget target)
			{
				String msg = String.format("stop drag '%s'", this.getComponent().getMarkupId());
				output.setModel(new Model(msg));
				target.addComponent(output);
			}
		});

		/**
		 * Draggable init once
		 */
		final Label output1 = new Label("output1");
		output1.setOutputMarkupId(true);
		tabContainer.add(output1);

		JQDraggable d2 = JQDraggableUtils.create("draggable2", "dragplugin").build();
		tabContainer.add(d2);

		JQDraggable d3 = JQDraggableUtils.create("draggable3", "dragplugin").build();
		tabContainer.add(d3);

		JQDraggable d4 = JQDraggableUtils.create("draggable4", "dragplugin").build();
		tabContainer.add(d4);

		JQCore.get().getPlugin("dragplugin").setInitMode(JQPlugin.PLUGIN_INIT_ONCE);
		JQCore.get().getPlugin("dragplugin").setInitOnceSelector(".drag-yellow");

		((JQDraggablePlugin) JQCore.get().getPlugin("dragplugin")).getOptions().setRevert(true);
		((JQDraggablePlugin) JQCore.get().getPlugin("dragplugin")).getOptions().setHelper(JQDraggableOptions.HELPER_CLONE);

		d4.add(new OnDragStartBehavior()
		{
			public void onStart(AjaxRequestTarget target)
			{
				String msg = String.format("start drag '%s'", this.getComponent().getMarkupId());
				output1.setModel(new Model(msg));
				target.addComponent(output1);
			}
		});
		d4.add(new OnDragStopBehavior()
		{
			public void onStop(AjaxRequestTarget target)
			{
				String msg = String.format("stop drag '%s'", this.getComponent().getMarkupId());
				output1.setModel(new Model(msg));
				target.addComponent(output1);
			}

		});

		JQChili chili1 = new JQChili("chili1");
		add(chili1);
		this.bindChiliCode(chili1, this.getClass(), "html");

		JQChili chili2 = new JQChili("chili2");
		add(chili2);
		this.bindChiliCode(chili2, this.getClass(), "java");

		JQCore.get().bindOnDocumentReadyFunction();
	}
}
